;
(function (call) {
    var zqjdjsModalStation = {
        mapId: "tjMap",
        selectedPro: [],
        playList: null,
        latestTime: null,
        isFirstGetTime: true,
        areaExent: {
            12: [114.94, 38.32, 119.80, 40.47], // 全市
            hhly: [108.71, 43.88, 123.66, 35.55] // 海河流域
        },
        perValue:"90,95",
        router: {
            queryData: "/modelMsisExtreme/statisticsStation",
        },
        stationId:[
            54517,
            54526,
            54527,
            54622,
            54528,
            54523,
            54525,
            54623,
            54428,
            54529,
            54619],
        stationName:[
            "天津市区"
            ,"东丽区"
            ,"西青区"
            ,"津南区"
            ,"北辰区"
            ,"武清区"
            ,"宝城区"
            ,"滨海新区"
            ,"蓟州区"
            ,"宁河区"
            ,"静海区"
        ], 
        init: function () {
            var that = this;
			if(!$("#qhpjjsTime").val()){
				$("#qhpjjsTime").val(new Date().format("yyyy-MM-dd"));
			}
			that.loadData();
			that.bindEvt();
            
        },
        
        /**
         * 绑定事件操作
         */
        bindEvt: function () {
            var that = this;
            
            $(".qhpjjsTime").off('change').on('change', function (e) { // 日期点击
                that.loadData();
            })
			 $("#qhpjjsSxSelect").off('change').on('change', function (e) { // 时效切换
               that.loadData();
            })
			 
			
        },
		
        // 加载数据
        loadData(){
            var that = this;
            $.ajax({
                url: that.router.queryData,
                async: false,
                dateType: 'json',
                data: { 
                    fcstTime: $("#qhpjjsTime").val() +" 08:00:00",
					model:'PUB',
					aging:$("#qhpjjsSxSelect").find("option:selected").attr("lid")
                    //perValue:that.perValue
                }
            }).done(function (res) {
				debugger
                if (res.result && res.data){
                    that.loadTable(res);
                    that.loadCharts(res);
                } 
                
            }).fail(function () {
               
            })
        },
        loadTable(res){
            var that = this;
            var pers = that.perValue.split(",");
            var html = '<table>';
			
			html += '<thead>';
			html += '<tr>';
			html += '<td>区域</td>';
			that.stationName.forEach(name =>{
				html += '<td>'+name+'</td>';
			})
			html += '</tr>';
			html += '</thead><tbody>';
			for(var i=0;i<pers.length;i++){
				html += '<tr>';
				html += '<td>'+pers[i]+'%</td>';
				that.stationId.forEach(staId =>{
					html += '<td>'+res.data[staId].list[i]+'</td>';
				})
				html += '</tr>'
			}
			html += '</tbody></table>';
			
            $(".zqjdjs-table").html(html);
        },
        loadCharts(res){
            var that = this;
            var pers = that.perValue.split(",");
			var seriesData = [];
            var categories = that.stationName;
            var colors=["#FEDCDA","#FEF4D6","#D6ECFA","#FEE8D4"]
			pers.forEach(function (s, i) {
				var data = [];
				that.stationId.forEach(staId =>{
					data.push(Number(res.data[staId].list[i]));
				})
				seriesData.push({
					name: s + "%",
					type: 'column',
					data: data,
					color:colors[i]
				})
			})
            
			var trendChart = {
				title: {
                    text:"天津各站点"+$("#qhpjjsTime").val()+"日气候平均降水阈值",
                    style:{
                        fontSize:"14px"
                    }
                },
				chart: {
					type:"column"
				},
				exporting: {
					enabled: false
                },
                credits:{
                    enabled:false
                },
				tooltip: {
					shared: true,
                    useHTML: true,
                    
					
				},
				plotOptions: {
					series: {
						connectNulls: true,
						marker: {
							symbol: 'circle'
                        },
                        /*dataLabels:{
                            enabled:true,
                            formatter:function(){
                                return this.point.y+"mm"
                            }
                        }*/
					}
				},
				xAxis: {
					categories: categories,
					
				},
				yAxis: {
					title: {
                        text:"降水量：mm"
                    }
				},
				series: seriesData
			};
			
			Highcharts.chart('zqjdjsChart', trendChart);
        },
    }
    
    if (typeof call === 'function') {
        CafeJS.zqjdjsModalStation = zqjdjsModalStation;
        call(zqjdjsModalStation);
    }
    window.zqjdjsModalStation = zqjdjsModalStation;
})(function (zqjdjsModalStation) {
    CafeJS.models(['ajax'], function () {
        zqjdjsModalStation.init();
    });
});
